<template>
	<uni-popup ref="passwordPopup" type="center" :mask-click="true" @maskClick="closeModal">
		<view class="password-modal">
			<view class="popup-content">
				<!-- 标题 -->
				<view class="title-box"><image class="title-img" src="/static/footImg/042.png"></image></view>
				<!-- 富文本 -->
				<view class="txt-html" v-html="contentList"></view>
				<!-- 按钮 -->
				<view class="btn-true">I got it</view>
			</view>
		</view>
	</uni-popup>
</template>

<script>
	import api from '../../http/api'
    import richTextUtil from '@/src/utils/richTextUtil.js'
	export default {
	  props: {
	    contentList:String
	  },
	  computed: {
	    tabList() {
	      return []
	    }
	  },
	  onLoad() {
	  	this.open()
	  },
	  methods: {
	    // 打开弹窗（供父组件调用）
	    open() {
	    	this.$refs.passwordPopup.open();
	    },
	    
	    // 关闭弹窗
	    closeModal() {
	    	this.$refs.passwordPopup.close();
	    	this.$emit('close');
	    },
		//已读
		reding(){
			api.MessageReading({}).then(res=>{
				
			})
		}
	  }
	}
</script>

<style>
	/* 弹窗样式 - 优化版 */
	.password-modal {
		/* width: 85vw;
		max-width: 650rpx; */
		background: linear-gradient(135deg, #f8f9fd 0%, #ffffff 100%);
		border-radius: 24rpx;
		overflow: hidden;
		box-shadow: 0 10rpx 40rpx rgba(0, 0, 0, 0.15);
	}
	.popup-content{
		width: 300px;
		
	}
	.title-box{
		background-color: #044484;
		text-align: center;
		padding: 10px 0;
	}
	.title-img{
		width: 150px;
		height: 30px;
		/* object-fit: contain; */
	}
	.txt-html{
		min-height: 50px;
	}
	.btn-true{
		background-color: #044484;
		color: #fff;
		text-align: center;
		border-radius: 60px;
		padding: 10px 20px;
		margin: 15px 20px;
	}
</style>